<!DOCTYPE html>
<html>
<head>
    <title>登录</title>
    <#include "header.html">

    <style>


        .from-user {
            padding: 10px;
            background: #fff;
        }

        .from-user .cell-list .cell-item {
            display: -ms-flexbox;
            display: flex;
            -ms-flex: 1;
            flex: 1;
            -ms-flex-pack: start;
            justify-content: flex-start;
            -ms-flex-align: center;
            align-items: center;
            -ms-flex-direction: row;
            flex-direction: row;
            -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
            border-bottom: 1px solid #eee;
            padding: 10px 10px 10px 0;
            margin: 10px 0;
            position: relative;
        }

        .from-user .cell-list .cell-item .left span {
            font-size: 16px;
            color: #333;
        }
        .from-user .cell-list .cell-item .right{
            width: 70%;
            margin-left: 20px;
        }
        .from-user .cell-list .cell-item .right input {
            width: 100%;
            border: none;
            outline: none;
            box-shadow: none;
            text-shadow: none;
            text-align: left;
            font-size: 16px;
            color: #333;
        }
        .cell-btn {
            background: #3389EE;
            color: #fff;
            /* font-size: 16px; */
            text-align: center;
            margin-top: 40px;
            border-radius: 2px;
            width: 100%;
            padding: 10px 0;
        }
        .from-user .other-link {
            display: -ms-flexbox;
            display: flex;
            -ms-flex: 1;
            flex: 1;
            -ms-flex-pack: justify;
            justify-content: space-between;
            -ms-flex-align: center;
            align-items: center;
            -ms-flex-direction: row;
            flex-direction: row;
            -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
            font-size: 15px;
            color: #81838e;
            margin-top: 40px;
        }
    </style>
</head>
<body>

<div id="app">

    <div  class="from-user">
        <div  class="cell-list">
            <div  class="cell-item">
                <div  class="left"><span >账号</span></div>
                <div  class="right"><input  type="text"  v-model="useUserInfo.username" placeholder="请输入用户名" ></div>
              </div>
            <div  class="cell-item">
                <div  class="left"><span >密码</span></div>
                <div  class="right"><input  name="password"  v-model="useUserInfo.password" placeholder="请输入密码" type="password"></div>

            </div>
        </div>
        <div  class="cell-btn " @click="login">登录</div>
        <div  class="other-link" @click="forgetPsw"><span ></span> <span
                >忘记密码</span></div>
    </div>

</div>

</body>

<script>


  var vm =  new Vue({
        el: '#app',
        data: {
            useUserInfo: {}
        },
        created: function () {
            this.selected = '首页';


        },
        methods: {
            login: function () {
                var url ="login";

                $.ajax({
                    type: "POST",
                    url:   url,
                    timeout:30000,
                    contentType: "application/json",
                    data: JSON.stringify(vm.useUserInfo),
                    beforeSend:function (){

                        vm.$indicator.open();
                    },
                    success: function(r){
                        if(r.code === 0){
                            vm.$indicator.close();


                            window.location.href="maintainmap?username="+vm.useUserInfo.username;

                        }else{
                            vm.$indicator.close();
                            vm.$toast({
                                message: r.msg,
                                duration: 2000
                            });
                        }
                        vm.$indicator.close();
                    },
                    error :function () {
                        vm.$indicator.close();
                        vm.$toast({
                            message: '操作失败',
                            duration: 2000
                        });
                    }
                });
            },
            forgetPsw:function () {
                vm.$toast({
                    message: '暂不提供该功能',
                    duration: 2000
                });
                //window.location.href="../../wx/lead/forgetPsw?openId=" + vm.openId;
            }
        }
    })
</script>
</html>